@import "utils";
.FloatingImageButton {
  z-index: 10;
  position: absolute;
  bottom: 1rem;
  right: 1rem;
  background: #475869;
  transition: all ease-in 0.15s;
  opacity: 0.4;
  @include material-shadow(3, 0.25);
  @include hover() {
    opacity: 1;
    background: lighten(#475869, 5%);
  }
  &:active {
    background: darken(#475869, 2.5%);
  }
  color: white;
  height: 3.5rem;
  width: 3.5rem;
  font-size: 1.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.FloatingImageButton + .tooltip {
  @include media("<large") {
    display: none !important;
  }
}
